<!--
 * @Author: songxiang songxiang0806@qq.com
 * @Date: 2025-08-21 11:17:09
 * @LastEditors: songxiang songxiang0806@qq.com
 * @LastEditTime: 2025-08-25 11:01:43
 * @FilePath: \supermap-webgl\src\views\top-menus\top-menus.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="top-menus-container">
    <el-button-group class="ml-4">
      <el-button
        type="primary"
        v-for="(item, index) in menus"
        :key="index"
        @click="useMenuStore.setMenu(item.component)"
      >
        {{ item.desc }}
      </el-button>
    </el-button-group>
  </div>
</template>

<script lang="ts" setup>
import {} from 'vue'
import useTopMenus from './use-top-menus'
import { useTopMenusStore } from '/@src/store/top-menus/top-menus'

const useMenuStore = useTopMenusStore()
const { menus } = useTopMenus()
</script>

<style scoped lang="scss">
@import url('./top-menus.scss');
</style>
